import 'package:easy_rich_text/easy_rich_text.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../../../../assets/styles.dart';
import '../../../../generate/app_image_path.dart';
import '../../../../services/user_service.dart';
import '../../../../utils/color.dart';
import '../../../../utils/extension.dart';
import '../../common/ai_make_button.dart';
import '../../common/ai_picker_icon.dart';
import '../../common/ai_stepper.dart';
import '../../controllers/tabs/ai_tab_cloth_page_controller.dart';

class AiTabClothPage extends StatelessWidget {
  const AiTabClothPage({super.key});

  Widget _buildPick(AiTabClothPageController _) {
    return Container(
      height: 179.w,
      decoration: BoxDecoration(
        borderRadius: Styles.borderRadius.m,
        color: COLOR.white.withValues(alpha: 0.1),
      ),
      clipBehavior: Clip.hardEdge,
      child: Obx(
        () {
          final image = _.pickedImage.value;
          if (image.isEmpty) {
            return Center(child: AiPickerIcon(onTap: _.onTapPicker));
          } else {
            return Stack(
              children: [
                Image.memory(
                  image.bytes,
                  fit: BoxFit.cover,
                  width: double.infinity,
                ),
                Positioned(
                  right: 5.w,
                  top: 5.w,
                  child: Image.asset(
                    AppImagePath.ai_upload_close,
                    width: 15.w,
                    height: 15.w,
                  ).onTap(_.onTapClear),
                )
              ],
            );
          }
        },
      ),
    );
  }

  Widget _buildPickTips() {
    return Obx(() {
      final userService = Get.find<UserService>();
      final freeCount = "${userService.user.aiNum ?? 0}";
      const size = '2M';
      const interval = '60s';

      return EasyRichText(
        '图片不可超过$size，上传间隔为$interval，您有免费次数$freeCount',
        defaultStyle: TextStyle(
          fontSize: 12.w,
        ),
        patternList: [
          EasyRichTextPattern(
            targetString: size,
            style: TextStyle(fontSize: 12.w, color: COLOR.color_FF9205),
          ),
          EasyRichTextPattern(
            targetString: interval,
            style: TextStyle(fontSize: 12.w, color: COLOR.color_FF9205),
          ),
          EasyRichTextPattern(
            targetString: freeCount,
            stringBeforeTarget: "次数",
            matchWordBoundaries: false,
            style: TextStyle(fontSize: 12.w, color: COLOR.color_FF9205),
          )
        ],
      );
    });
  }

  Widget _buildStepper(AiTabClothPageController _) {
    return AiStepper(
      AiTabClothPageController.steps,
      headTailWidth: 51.w,
      controller: _.stepController,
    );
  }

  Widget _buildTips() {
    final titleStyle = TextStyle(
      fontSize: 14.w,
      color: COLOR.white,
    );
    final tipsStyle = TextStyle(
      fontSize: 12.w,
      color: COLOR.white.withValues(alpha: 0.8),
    );
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text('注意事项：', style: titleStyle),
        Text('1.照片只含一名人物', style: tipsStyle),
        Text('2.图片不能过暗', style: tipsStyle),
        Text('3.图片尽量清晰，否则会出现失败或影响效果', style: tipsStyle),
      ].joinHeight(10.w),
    );
  }

  Widget _buildCaseTitle() {
    return Text(
      '示例',
      style: TextStyle(fontSize: 14.w, color: COLOR.white),
    );
  }

  Widget _buildCase() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Image.asset(
          AppImagePath.ai_cloth_case_1,
          width: 162.w,
          height: 224.w,
        ),
        Image.asset(
          AppImagePath.ai_cloth_case_2,
          width: 162.w,
          height: 224.w,
        ),
      ],
    );
  }

  Widget _buildButtons(AiTabClothPageController _) {
    return Center(child: AiMakeButton('上传', width: 240.w, onTap: _.onTapMake));
  }

  Widget _buildBody(AiTabClothPageController _) {
    return CustomScrollView(
      slivers: [
        SizedBox(height: 15.w).sliver,
        _buildPick(_).sliver,
        SizedBox(height: 10.w).sliver,
        _buildPickTips().sliver,
        SizedBox(height: 15.w).sliver,
        _buildStepper(_).sliver,
        SizedBox(height: 20.w).sliver,
        _buildButtons(_).sliver,
        SizedBox(height: 20.w).sliver,
        _buildTips().sliver,
        SizedBox(height: 15.w).sliver,
        _buildCaseTitle().sliver,
        SizedBox(height: 5.w).sliver,
        SliverFillRemaining(hasScrollBody: false, child: _buildCase()),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    final _ = Get.find<AiTabClothPageController>();
    return _buildBody(_);
  }
}
